<!DOCTYPE html>
<html lang="cn" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title th:text="${session.lang == 'en' ? menu.titleEn : menu.title}"></title>
    <meta name="keywords" th:content="${companyProfile.seoKeyword}">
    <meta name="description" th:content="${companyProfile.seoDescription}">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="renderer" content="webkit">
    <link rel="stylesheet" href="../statics/css/amazeui.min.css">
    <link rel="stylesheet" href="../statics/css/animate.css">
    <link rel="stylesheet" href="../statics/css/layout.css">
    <link rel="stylesheet" href="../statics/css/pages.css">
    <link rel="stylesheet" href="../statics/iconfont/iconfont.css">
    <link rel="stylesheet" href="../statics/css/jq-pages.css">
    <link rel="stylesheet" href="../statics/css/demo.css" type="text/css" media="screen"/>
    <link rel="stylesheet" href="../statics/css/venobox/venobox.css" type="text/css" media="screen"/>
    <script src="../statics/js/jquery-1.11.0.min.js"></script>
    <script src="../statics/js/amazeui.min.js"></script>
    <script src="../statics/js/amazeui.lazyload.min.js"></script>
    <script src="../statics/js/jq-pages.js"></script>
    <script type="text/javascript" src="../statics/js/venobox/venobox.min.js"></script>
</head>
<body>
<style>
    body {
        background-color: #f2f2f2;
    }

    #main-nav-hold .main-nav,
    .am-nav,
    .rb-topnav,
    .rb-topbar {
        background: #192C69;
    }

    @media screen and (max-width: 767px) {
        .rb-topbar {
            background: #fff;
        }
    }

    .rb-topnav .rb-pagenav .item > a,
    #main-nav-hold a {
        color: #eee;
    }

    .rb-pagenav .item a.nav-btn {
        color: #787878;
    }

    .rb-pagenav .item a.rb-active,
    .rb-pagenav .item a:hover {
        color: #ffffff;
        font-weight: bold;
    }

    .rb-topnav .rb-pagenav .item a.rb-active,
    .rb-topnav .rb-pagenav .item a:hover {
        color: #ffffff;
        font-weight: bold;
    }

    .rb-language {
        color: #ddd;
    }

    .sb-search-input {
        background-color: #fff;
    }

    .sb-search-input::placeholder {
        color: #999 !important;
    }

    .sb-icon-search,
    .sb-search-submit {
        background: url('../statics/images/search-3.png') no-repeat 10px 14px;
    }

    .rb-footer {
        border-top: 1px solid #f6f5f5;
        background-color: #fff;
    }

    .am-slider-content {
        top: 45%;
    }

    .new-banner {
        height: 600px;
    }

    @media (max-width: 768px) {
        .new-banner {
            height: 400px;
        }

        .am-slider-i2 .am-slider-desc {
            top: 49% !important;
        }
    }
</style>
<div th:replace="header :: header"></div>
<div class="new-banner am-slider-i2" th:style="'width:100%;background: url(' + ${menu.bgImage} + ') no-repeat;background-size: cover;position: relative;'">
    <div class="am-container am-slider-desc">
        <div class="am-slider-content">
            <h3 class="up-en am-slider-title am-animation-slide-left" style="color:#fff;" data-am-scrollspy="{animation: 'slide-left', delay: 100}">
                <th:block th:text="${menu.title}"></th:block>
            </h3>
            <h3 data-am-scrollspy="{animation:'slide-right', delay: 500}" class="up-cn am-animation-slide-right" style="color:#fff;">
                <th:block th:text="${menu.titleEn}"></th:block>
            </h3>
            <i data-am-scrollspy="{animation:'slide-bottom', delay: 700}" style="background-color:#fff;" class="am-animation-slide-bottom"></i>
            <div data-am-scrollspy="{animation:'slide-left', delay: 1200}" class="rb-bantxt am-animation-slide-right" style="color:#fff;">
                <th:block th:text="${session.lang == 'en' ? menu.descriptionEn : menu.description}"></th:block>
            </div>
        </div>
    </div>
</div>
<div class="amz-container">
    <div class="amz-container rb-hg80"></div>
    <div class="am-container-1 am-g rb-list">
        <div th:if="${news != null && news.size() >= 1}" class="am-u-lg-8 am-u-md-8 am-u-sm-12 rb-list2 am-animation-slide-left" data-am-scrollspy="{animation: 'slide-left', delay: 300}">
            <a th:href="'/new_detail?id=' + ${news.get(0).id}">
                <div class="rb-news rb-listbig">
                    <div class="rb-newslistcon">
                        <h3 th:text="${session.lang == 'en' ? news.get(0).titleEn : news.get(0).title}"></h3>
                        <p th:text="${session.lang == 'en' ? news.get(0).descriptionEn : news.get(0).description}"></p>
                        <span th:text="${#dates.format(news.get(0).createtime, 'yyyy年MM月dd日')}">2021年06月26日</span>
                    </div>
                    <img th:src="${news.get(0).img}" alt=""/>
                </div>
            </a>
        </div>
        <div th:if="${news != null && news.size() >= 2}" class="am-u-lg-4 am-u-md-4 am-u-sm-12 rb-list2 am-avg-1 am-animation-slide-right" data-am-scrollspy="{animation: 'slide-right', delay: 300}">
            <a th:href="'/new_detail?id=' + ${news.get(1).id}">
                <div class="rb-news rb-ssimg rb-listsig-1">
                    <div class="rb-newslistcon">
                        <p th:text="${session.lang == 'en' ? news.get(1).descriptionEn : news.get(1).description}"></p>
                        <span th:text="${#dates.format(news.get(1).createtime, 'yyyy年MM月dd日')}">2021年06月26日</span>
                    </div>
                    <img th:src="${news.get(1).img}" alt=""/>
                </div>
            </a>
        </div>
        <div th:if="${news != null && news.size() >= 3}" class="am-u-lg-4 am-u-md-4 am-u-sm-12 rb-list2 am-avg-1 am-animation-slide-right" data-am-scrollspy="{animation: 'slide-right', delay: 300}">
            <a th:href="'/new_detail?id=' + ${news.get(2).id}">
                <div class="rb-news rb-ssimg rb-listsig-2">
                    <div class="rb-newslistcon">
                        <p th:text="${session.lang == 'en' ? news.get(2).descriptionEn : news.get(2).description}"></p>
                        <span th:text="${#dates.format(news.get(2).createtime, 'yyyy年MM月dd日')}">2021年06月26日</span>
                    </div>
                    <img th:src="${news.get(2).img}" alt=""/>
                </div>
            </a>
        </div>
    </div>
    <div style="text-align: center;margin:50px auto 0;">
        <input type="hidden" id="pageNo" th:value="${pageNo}"/>
        <input type="hidden" id="pageSize" th:value="${pageSize}"/>
        <div id="pager" class="pager clearfix">
        </div>
    </div>
    <div class="amz-container rb-hg80"></div>
    <script src="../statics/js/canvas.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var hbimg = $(".rb-listbig").height();
            var wbimg = $(".rb-listbig").width();
            var hsimg = $(".rb-ssimg").height();
            var wsimg = $(".rb-ssimg").width();

            $(".rb-listbig img").css({
                "height": hbimg,
                "width": wbimg
            });
            $(".rb-ssimg img").css({
                "height": hsimg,
                "width": wsimg
            });

            $('.venoboxinline').venobox({
                framewidth: '100%',
                frameheight: '100%',
                bgcolor: '#ffffff'
            });
        })
        $("#pager").zPager({
            current: $("#pageNo").val(),
            totalData: $("#pageSize").val(),
            htmlBox: $('#wraper'),
            btnShow: true,
            ajaxSetData: false
        });
        function currentPage(currentPage) {
            /*
              触发页码数位置： Page/js/jquery.z-pager.js 64行
            */
            console.log("当前页码数：" + currentPage);
            if($("#pageNo").val() != currentPage){
                window.location.href = '/new_list?pageNo=' + currentPage;
            }
        }
    </script>

</div>
<!--#include file="/public/html/footer.html"-->
<div th:replace="footer :: footer"></div>
</body>
</html>